<template>
	<view class="background">
		<view class="img">
			<image src="../../../static/images2/login/logo.png" mode="" class="logo" @click="CreditorLanding"></image>
			<view class="login-title">
				欢迎登录宜信签债务平台
			</view>
		</view>
		
		<view class="formData">
			<formData :values="phoneValues" :fields="phoneFields" v-if="num == 1" :rules="passwordRules" ref="FormData"
				name="account" event="mobilelogin" labelAlign="left">
				<template slot="slot">
					
				</template>
			</formData>
			<formData :values="passwordValues" :fields="passwordFields" :rules="passwordRules" ref="password"
				labelAlign="left" v-else>
				<template slot="slot">
					
				</template>
			</formData>
		</view>
		<view class="button_error d-f-j-c-a-i" @click="disembark"> 登录 </view>
		<view class="password_login" @click="passwordLogin">
			<view class="password_login_left"> {{ title }}</view>
			<view class="password_login_right" @click="registerNow">新用户注册</view>
		</view>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>


<script>
	import FormData from "@/components/form/index";

	import {
		mapState,
		mapMutations,
		mapActions
	} from "vuex";
	export default {
		data() {
			return {
				title: "验证码登陆",
				num: 2,
				index: 0,
				start_time: 0,
				end_time: 0
			};
		},
		components: {
			FormData,
		},
		methods: {
			...mapMutations({
				resetPhone: "LOGIN/RESET_PHONE", //重置验证码表单
				resetPassword: "LOGIN/RESET_PASSWORD", //重置验证码表单
			}),
			...mapActions({
				registerLogin: "LOGIN/REGISTER_LOGIN", //注册
				obligorAshore: "LOGIN/OBLIGOR_ASHORE", //债务人登录
				creditorAshore: "LOGIN/CREDITOR_ASHORE", //债权人登录
			}),
			passwordLogin() {
				if (this.num == 1) {
					this.resetPhone();
					this.title = "验证码登录";
					this.num = 2;
				} else {
					this.resetPassword();
					this.title = "密码登录";
					this.num = 1;
				}
			},
			disembark() {
				
				 
				let flag = false;
				if (this.num == 1) {
					flag = this.$refs.FormData.submit();
				} else {
					flag = this.$refs.password.submit();
				}
				if (flag) {
					if (this.num == 1) {
						if (this.phoneValues.captcha == "") {
							this.$u.toast("请输入4位短信验证码");
						} else {
							this.obligorAshore(this.num);
						}
					} else {
						uni.showLoading({
							title: "加载中",
						});
						this.obligorAshore(this.num);
					}
				}
			},
			CreditorLanding() {
				this.index = this.index == 0 ? 1 : this.index + 1;
				if (this.index == 1) {
					this.start_time = new Date().getTime();
					setTimeout(() => {
						this.index = this.start_time = this.end_time = 0;
					}, 200)
				} else if (this.index == 2) {
					this.end_time = new Date().getTime();
					if (this.end_time - this.start_time < 300) {
						uni.navigateTo({
							url: '/pages/creditor/login/index'
						});
					}
					this.index = this.start_time = this.end_time = 0;
				}

			
			},
			registerNow() {
				uni.navigateTo({
					url: '/pages/loanee/login/registration'
				});
			},
			//债务人首页
			obligor() {
				uni.switchTab({
					url: '/pages/loanee/obligor/index'
				})
			},
			//债权人首页
			creditor() {
				uni.switchTab({
					url: '/pages/creditor/personam/index'
				})
			},
		},
		mounted() {
		},
		onShow() {
			let group_id = uni.getStorageSync('group_id');
			let token = uni.getStorageSync('token');
			if (group_id && token) {
				if (group_id == 1) {
					this.obligor() // 1债务人
				} else {
					this.creditor() // 2债权人
				}

			}



		},
		watch: {},
		computed: {
			...mapState({
				phoneFields: (state) => state.LOGIN.phoneFields,
				passwordFields: (state) => state.LOGIN.passwordFields,
				phoneValues: (state) => state.LOGIN.phoneValues,
				passwordValues: (state) => state.LOGIN.passwordValues,
				passwordRules: (state) => state.LOGIN.passwordRules,
			}),
		},

		onLoad() {},
	};
</script>

<style scoped lang='scss'>
	@import "@/common/login.scss";
	
	.formData {
		/deep/ {
			.u-form-item--left {
				
			}
		}
	}
</style>
/* <style>
	.uni-app--maxwidth {
		background-color: #ffffff !important;
	}
</style> */
